<style type="text/css">
    .template-mobile{
        display: block;
        width: 149px;
        height: 378px;
        padding: 59px 14px 87px 16px;
        margin-bottom: 8px;
        background: url('http://img-dev.myscrmimg.cn/projects/qmyx/public/images/style/templet_bg.png') no-repeat;
        background-position: -179px 0;
    }
    /*颜色选择*/
    .color-picker {
        position: absolute;
        width: 435px;
        z-index: 2;
        border: 1px solid silver;
        background: #fff;
        margin-top: 6px;
    }

    .color-picker li {
        padding: 8px;
        margin: 4px 3px;
        float: left;
        border: 1px solid #f0f0f0;
        cursor: pointer;
    }

    .color-picker li:hover,.color-picker .selected {
        border: 1px solid #e78f08;
    }
</style>
<form name="invite_broker_form">
    <table width="100%" class="mt10" id="invitebroker_tab" ng-controller="InviteBrokerController">
        <tbody>
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top">邀请经纪人功能：</td>
            <td class="pt12">
                <div class="switch fl switch-off" id="invitebroker_btn">
                    <span class="switch-text">关</span>
                    <span class="switch-white"></span>
                </div>
            </td>
        </tr>
        </tbody>
        <tbody class="invitebroker-mes" ng-if="showInvitebrokerMes">
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top">邀请注册奖励：</td>
            <td class="pt12">
                <input type="number" name="inviter_reg_reward" id="inviter_reg_reward" class="input-text mr5 w400"
                       ng-model="data.inviteBrokerBonus" integer min="0">
                <span class="mr5">元</span>


            <span role="alert"
                  ng-show="invite_broker_form.inviter_reg_reward.$touched && invite_broker_form.inviter_reg_reward.$error.number"
                  class="error ng-hide c-red lh30">
                奖励金额需为整数</span>
            <span role="alert"
                  ng-show="invite_broker_form.inviter_reg_reward.$touched && invite_broker_form.inviter_reg_reward.$error.min"
                  class="error ng-hide c-red lh30">
                奖励金额需为大于等于0整数</span>
            </td>
        </tr>
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top"><em class="c-red">*&nbsp;</em>选择启用该功能的经纪人类型：</td>
            <td class="pt19">
                <div style="display:block">
                    <div class="fl">
                        <label class="checkbox">
                            <input type="checkbox" id="cb1" value="1" name="cb1"
                                   ng-model="data.brokerIdentity.selectedAll"
                                   ng-change="updateBrokerIdentityCheckAll(item)">
                            <span>全部</span>
                        </label>
                    </div>
                    <div class="tips-list clearfix">
                        <label class="checkbox" ng-repeat="item in data.brokerIdentity">
                            <input type="checkbox" id="{{item.myParamValueId}}" ng-model="item.selected"
                                   ng-change="updateBrokerIdentityCheck(item)">
                            <span>{{item.Text}}</span>
                        </label>
                    </div>
                    <!-- tips -->
                    <div id="tips">
                        <div class="tips-wrap" ng-show="showAgentCompany || showAgencyCompany || showPartnerCompany">
                            <div class="tips-con clearfix" style="padding:10px;">
                                <!-- 列表项 -->
                                <div ng-show="showAgentCompany">
                                    <div class="fl mr5">代理公司：</div>
                                    <div class="fl">
                                        <label class="checkbox">
                                            <input type="checkbox" id="agentcompany_all"
                                                   ng-model="data.agentCompany.selectedAll"
                                                   ng-change="updateAgentCompanyCheckAll()">
                                            <span>全部</span>
                                        </label>
                                    </div>
                                    <div class="tips-list clearfix" style="margin-left: 120px;">
                                        <label class="checkbox" ng-repeat="item in data.agentCompany">
                                            <input type="checkbox" ng-model="item.selected"
                                                   ng-change="updateAgentCompanyCheck(item)">
                                            <span>{{item.Text}}</span>
                                        </label>
                                    </div>
                                </div>
                                <div ng-show="showAgencyCompany">
                                    <div class="fl mr5">中介公司：</div>
                                    <div class="fl">
                                        <div class="checkbox">
                                            <input type="checkbox" id="agent_all"
                                                   ng-model="data.agencyCompany.selectedAll"
                                                   ng-change="updateAgencyCompanyCheckAll()">
                                            <label for="agent_all">全部</label>
                                        </div>
                                    </div>
                                    <div class="tips-list clearfix" style="margin-left: 120px;">
                                        <label class="checkbox" ng-repeat="item in data.agencyCompany">
                                            <input type="checkbox" ng-model="item.selected"
                                                   ng-change="updateAgencyCompanyCheck()">
                                            <span>{{item.Text}}</span>
                                        </label>
                                    </div>
                                </div>
                                <div ng-show="showPartnerCompany">
                                    <div class="fl mr5">伙伴公司：</div>
                                    <div class="fl">
                                        <label class="checkbox">
                                            <input type="checkbox" id="partnerCompany_All"
                                                   ng-model="data.partnerCompany.selectedAll"
                                                   ng-change="updatePartnerCompanyCheckAll()">
                                            <span for="partnerCompany_All">全部</span>
                                        </label>
                                    </div>
                                    <div class="tips-list clearfix" style="margin-left: 120px;">
                                        <label class="checkbox" ng-repeat="item in data.partnerCompany">
                                            <input type="checkbox" ng-model="item.selected"
                                                   ng-change="updatePartnerCompanyCheck()">
                                            <span>{{item.Text}}</span>
                                        </label>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </td>
        </tr>
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top">邀请注册页面设置：</td>
            <td class="pt12"></td>
        </tr>
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top">按键名称：</td>
            <td class="pt12">
                <input ng-model="data.regpage_button_name" class="input-text mr5 w400" type="text"
                        maxlength="8" name="button_name" placeholder=""/>
                <span class="c-gray">限制8个字</span>

            </td>
            <td rowspan="7">
                <div style="text-align: center;position: relative;">
                    <div class="template-mobile">
                        <img style="width:149px;height:263px;" ng-src="{{data.regpage_background_img}}"/>
                        <span class="buttoncolor-tmpl" style="background:{{ data.regpage_button_color }};padding:5px 10px;position: relative;bottom: 50px;border-radius: 20px;">
                            <span class="fontcolor-tmpl" style="color:{{ data.regpage_font_color }}">{{ data.regpage_button_name||'马上注册' }}></span>
                        </span>
                    </div>
                    <p style="position: absolute;bottom: 90px;text-align: center;width: 100%;">模板效果图<a href="javascript:void(0)" class="btn-copy c-orange pt10" style="display: block;" clipboard content="data.inviteUrl" aftercopy="afterCopy()">复制链接</a></p>

                </div>
            </td>
        </tr>
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top">字体颜色：</td>
            <td class="pt12">
                <span style="padding: 1px;cursor: pointer;width:26px;text-align:center;display: block;font-size:14px;"
                      ng-click="showFontColorPicker()"
                      class="font-board glyphicon glyphicon-font"
                        >
                    <p class="fontcolor-picker" style="width:100%;height:4px;background: {{ data.regpage_font_color }};border:1px solid #e2e2e2;margin-top: 2px;"></p>
                </span>
                <ul class="color-picker" ng-if="isShowFontColorPicker==true">
                    <li ng-repeat="color in colors" title="{{ color.text }}" ng-click="setFontColor(color.value)"
                        ng-class="{'selected':data.regpage_font_color=='{{color.value}}'}"
                        ng-style="{'background': '{{color.value}}'}"></li>
                </ul>
            </td>
        </tr>
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top">按钮颜色：</td>
            <td class="pt12">
                <span style="padding: 1px;cursor: pointer;width:26px;text-align:center;display: block;font-size: 14px;"
                      ng-click="showButtonColorPicker()"
                      class="font-board glyphicon glyphicon-edit"
                        >
                    <p class="buttoncolor-picker" style="width:100%;height:4px;background: {{ data.regpage_button_color }};border:1px solid #e2e2e2;margin-top: 2px;"></p>
                </span>
                <ul class="color-picker" ng-if="isShowBtnColorPicker==true">
                    <li ng-repeat="color in colors" title="{{ color.text }}" ng-click="setBtnColor(color.value)"
                        ng-class="{'selected':data.regpage_button_color=='{{color.value}}'}"
                        ng-style="{'background': '{{color.value}}'}"></li>
                </ul>
            </td>
        </tr>
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top">背景图片：</td>
            <td class="pt12">
                <div class="upload-wrap" style="height: 110px;width: 110px;text-align: center;">
                    <img ng-src="{{preview||data.regpage_background_img}}" style="width:100%;height:100%;"
                         ng-if="!!data.regpage_background_img">
                    <div ng-if="!data.regpage_background_img || data.regpage_background_img ==''" style="width: 100%;height: 100%;">
                        <span class="glyphicon glyphicon-picture" style="font-size: 110px;color: #e0e0e0;"></span></div>
                </div>

                <div style="clear: both;padding-top: 7px;">
                    <div ui-uploader is-image auto-upload ng-model="data.regpage_background_img" style="clear: both;"
                         state="uploader.state"
                         thumbnail="preview" name="img_url"
                         on-status-changed="uploadBackImages($data)"
                         extensions="jpg,png" maxfilesize="1024kb"
                         upload-btn-text="背景图上传"></div>
                    <span class="c-gray">建议尺寸(1080*1700)，大小1MB以内</span>
                        <span class="img-state ng-hide" ng-bind="uploader.state"
                              ng-show="uploader.state!='文件上传成功'"></span>
                </div>

            </td>
        </tr>
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top">邀请经纪人分享设置：</td>
            <td class="pt12"></td>
        </tr>
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top">标题：</td>
            <td class="pt12"><input type="text" name="share_title" class="input-text mr5 w400" name="share_title"
                                    value="" id="inviter_share_tit" ng-model="data.share_title" maxlength="20">
                <span class="c-gray">限制20个字</span>
            </td>
        </tr>
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top">摘要：</td>
            <td class="pt12">
                <textarea name="" id="" class="w400 textarea" name="inviter_share_des" id="inviter_share_des"
                          ng-model="data.share_summary" maxlength='40' ></textarea>
                <span class="c-gray">限制40个字</span>


                <div id="fileupload" class="fileinput-button fl" ng-click="uploadImg()">
                    <div class="upload-wrap" id="img_wrap">

                        <img style="width:80px;height:80px" ng-if="!!data.share_pic_url" ng-src="{{data.share_pic_url}}"/>

                        <div class="upload-btn" ng-if="!data.share_pic_url || data.share_pic_url ==''"><i
                                class="upload-icon"></i></div>
                        <!-- 上传的图片显示在这里 -->
                    </div>
                    <input type="file" name="file"/>

                    <div class="fl lh30 mt20">
                        <p class="c-gray f12">建议尺寸：80*80像素</p>
                        <span class="c-blue f12">上传缩略图</span>
                    </div>
                </div>
                <input type="hidden" id="share_invite_img" value="" ng-model="data.share_pic_url.url"/>

                <p class="c-red lh30 none js-err" style="clear:both;"></p>
        </tr>
        <tr>
            <td align="right" class="form-cell w200 pt16" valign="top">邀请经纪人活动规则设置：</td>
            <td class="pt12" colspan="2">
                <textarea class="b-gray lh24 p5 w620" name="activity_rule" id="activity_rule"
                          ng-model="data.activity_rule" required style="height:200px;"></textarea>
            <span role="alert"
                  ng-show="invite_broker_form.activity_rule.$touched && invite_broker_form.activity_rule.$error.required"
                  class="error ng-hide c-red lh30">
                请填写邀请经纪人活动规则设置</span>
            </td>
        </tr>
        </tbody>
        <tr>
            <td colspan="2" class="pt12">
                <button type="submit" class="btn fr permission p-500302-02" id="save_rule" style="margin-left: 526px"
                        ng-click="invite_broker_form.$valid && save()">保存设置
                </button>
            </td>
        </tr>
    </table>
</form>
